<template>
	<view class="flex-col page">
		<view class="flex-col flex-auto group">
			<view class="flex-row justify-between items-center section_3" @click="toAccount">
				<text class="font_2 text_5">修改登录密码</text>
				<image class="image_6" src="/static/more2.png" />
			</view>
			<view class="flex-row justify-between items-center section_3" @click="toCollect">
				<text class="font_2 text_5">修改手机号</text>
				<image class="image_6" src="/static/more2.png" />
			</view>
			<!-- <button open-type="getPhoneNumber" @getphonenumber="getPhoneNum" class="flex-row justify-between items-center section_3">
				<text class="font_2 text_5">修改手机号</text>
				<view class="flex-row items-center">
					<text class="phone">{{account_format}}</text>
					<image class="image_6" src="/static/more2.png" />
				</view>
			</button> -->
		</view>
	</view>
</template>

<script setup>
	import {
		onShow
	} from "@dcloudio/uni-app";
	import {
		onMounted,
		ref,
		reactive,
		getCurrentInstance
	} from "vue"
	const {
		proxy
	} = getCurrentInstance()
	let token = ref('')
	let account = ref('')
	let account_format = ref('')
	
	onShow(() => {
		if( uni.getStorageSync('token')){
			token.value= uni.getStorageSync('token')
			account.value= uni.getStorageSync('account')
			account_format.value= uni.getStorageSync('account_format')
			// getDate()
		}else{
			token.value=''
		}
		
	})
	const getPhoneNum = (e) => {
		console.log(e);
		if( e.detail.code){
			proxy.$req.requestPOST(proxy.$api.PassportInfo.getOauthMobile, {
				code: e.detail.code,
			}).then(res => {
				console.log(res, "获取手机号");
				proxy.$req.requestPOST(proxy.$api.WorkerCenterInfo.modifyAccount, {
					account: res.data.purePhoneNumber,
				}).then(res1 => {
					console.log(res1, "修改手机号");
					uni.showToast({
						title: res1.message,
						icon: 'none'
					})
					if (res1.flag == "success") {
						uni.setStorageSync('account', res.data.purePhoneNumber)
						let hiddenPhone = res.data.purePhoneNumber.replace(/(\d{3})\d{4}(\d{4})/, "$1****$2")
						uni.setStorageSync('account_format', hiddenPhone)
						setTimeout(() => {
							uni.navigateBack()
						}, 1500)
					} else {
						
					}
				})
			}).catch(e => {
				console.log(e);
			})
		}
		
	}
	const getDate = () => {
		proxy.$req.requestPOST(proxy.$api.WorkerCenterInfo.getWorkerInfo).then(res => {
			indexList.value.WorkerInfo=res.data
			console.log(indexList.value.WorkerInfo);
			if(res.flag=="error"){
				uni.showToast({
					title:res.message,
					icon:'none'
				})
			}
		})
	}
	const toLogin = () => {
		uni.navigateTo({
			url:'/pages/login/login'
		})
	}
	
	const toAccount = () => {
		uni.navigateTo({
			url:'/pages/modifyPassword/modifyPassword'
		})
	}
	const toCollect = () => {
		uni.navigateTo({
			url:'/pages/modifyPhone/modifyPhone'
		})
	}
	
</script>


<style scoped lang="scss">
	.page {
		background-color: #f8f8f8;
		width: 100%;
		overflow-y: auto;
		overflow-x: hidden;
		height: 100vh;

		.group {
			// padding-bottom: 1236rpx;
			overflow-y: auto;

			.section_3 {
				padding: 30rpx;
				background-color: #ffffff;

				.font_2 {
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: 500;
					color: #333333;
				}

				.text_4 {
					line-height: 26rpx;
				}

				.image_6 {
					width: 9rpx;
					height: 18rpx;
				}

				.text_5 {
					line-height: 27rpx;
				}
			}
		}
		.phone{
			font-size: 28rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #333333;
			margin-right: 10rpx;
		}
		.button {
			padding: 36rpx 0;
			background: linear-gradient(0deg, #1EBDFF, #6ED5FF);
			border-radius: 50rpx;
			width: 630rpx;
			position: fixed;
			bottom: 40rpx;

			.text_4 {
				color: #ffffff;
				font-size: 32rpx;
				font-family: PingFang SC;
				font-weight: 500;
				line-height: 31rpx;
			}
		}
	}
</style>